import type { Ref } from 'vue';


export function useBodySize(bodyRef: Ref) {
    const mainStyle = ref('')
    watch(mainStyle, (newVal) => {
        if (newVal) {
            bodyRef.value.querySelector(".main").setAttribute('style', mainStyle.value)
        }
    });
    const initBodySize = () => {
        if (bodyRef.value) {
            let scale_x = bodyRef.value.clientWidth / 1920;
            let h = (100 / scale_x).toFixed(2);
            mainStyle.value = `transform: scale(${scale_x});height:${h}%;`;
        }
        window.addEventListener('resize', () => {
            setTimeout(() => {
                if (bodyRef.value) {
                    let scale_x = bodyRef.value.clientWidth / 1920;
                    let h = (100 / scale_x).toFixed(2);
                    mainStyle.value = `transform: scale(${scale_x});height:${h}%;`;
                }
            });
        })
    };
    return {
        initBodySize
    }
}